//完成一个框架
//第一步的内容是完成一个自执行的匿名函数,把所有框架的代码放在里面,目的是为了防止全局变量的一个污染,
//并且通过window将对象暴露给外部使用  //保证内部的变量和方法不会影响全局 
//同时,传递window和document的目的是为了保证在局部使用
(function(window, document) {
	//首先创建一个$的函数 在函数的内部我们返回一个对象 ,这个对象是通过 new关键字实例化base构造函数实现的 当我们通过$()
	// 调用这个函数的时候,$('参数')会直接传递给构造函数,最终在构造函数的私有属性里面存放对应的DOM元素
	var $ = function(arc) {
			return new base(arc);
		}
		//设计一个构造函数
	function base(arc) {
		//存放的就是DOM元素了
		this.elements = [];
		//创建一个新数组
		var childElement = [];
		if(typeof arc == 'string') {
			//字符串 #id .clsss  div>span  div + span
			switch(arc.charAt(0)) {
				//id选择
				case '#':
					childElement.push(document.getElementById(arc.substring(1)));
					break;
					//class选择
				case '.':
					var list = document.getElementsByClassName(arc.substring(1));
					for(var i = 0; i < list.length; i++) {
						childElement.push(list[i]);
					}
					break;
					//tga选择
				default:
					var list = document.getElementsByTagName(arc);
					for(var i = 0; i < list.length; i++) {
						childElement.push(list[i]);
					}
					break;

			}

		} else if(typeof arc == 'function') {
			//不是字符串  function(){}
			DomReady(arc);
		}
		//最终我们将这个数组的内容给到this
		this.elements = childElement;
	}
	//构造函数的原型里面内置的方法
	base.prototype.init = function() {
		console.log('初始化方法');
		return this;
	}
	base.prototype.css = function(name, value) {
		//对DOM元素进行设置
		for(var i = 0; i < this.elements.length; i++) {
			this.elements[i].setAttribute('style', name + ':' + value);
		}
		return this;

	}
	base.prototype.html = function(content) {
		for(var i = 0; i < this.elements.length; i++) {
			this.elements[i].innerHTML = content;
		}
		return this;
	}
	base.prototype.adClass = function(value) {
		for(var i = 0; i < this.elements.length; i++) {
			this.elements[i].classList.add(value);
		}
		return this;
	}
	base.prototype.remclass = function(value) {
		if(value == null) {
			value = 'class';
			for(var i = 0; i < this.elements.length; i++) {
				this.elements[i].removeAttribute(value);
			}
		}
		for(var i = 0; i < this.elements.length; i++) {
			this.elements[i].classList.remove(value);
		}
		
		return this;
	}
	base.prototype.toggclass = function(value) {
		for(var i = 0; i < this.elements.length; i++) {
			this.elements[i].classList.toggle(value);
		}
		return this;

	}
	base.prototype.heigh = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var h = getComputedStyle(this.elements[i]).height;
		}
	
		return h;
	}
	base.prototype.widh = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var w = getComputedStyle(this.elements[i]).width;
		}
	
		return w;''
	}
	base.prototype.innwidh = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var inw = this.elements[i].clientWidth;
		}
	
		return inw;
	}
	base.prototype.innheight = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var inh = this.elements[i].clientHeight;
		}
	
		return inh;
	}
	base.prototype.outwidh = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var outw = this.elements[i].offsetWidth;
		}
	
		return outw;
	}
	base.prototype.outheigh = function () {
		for(var i = 0; i < this.elements.length; i++) {
			var outh = this.elements[i].offsetHeight;
		}
	
		return outh;
	}

	$.init = function() {
		console.log('初始化的工具方法')

	}
	$.extend = function(name, fn) {
			base.prototype[name] = fn;

		}
		//等待DOM加载完毕的时候
	function DomReady(fn) {
		document.window.addEventListener('DOMContentLoaded', function() {
			fn();
		})
		removeEventListener(document, 'DOMContentLoaded');

	}
	window.$ = window.lzy = $; //$暴露给外部使用

})(window, document)